<template>
	<view class="grace-padding">
	<!-- 评论区 start -->
	<view class="grace-comment">
		<view class="" v-for="(value,key) in commentList" :key="key">
			<view class="grace-comment-list">
				<view class="grace-comment-face">
					<image :src="staticUrl + 'logo.png'" mode="widthFix"></image>
				</view>
				<view class="grace-comment-body">
					<view class="grace-comment-top">
						<text>{{value.createUser}}</text>
						<text class="grace-iconfont icon-zan"></text>
					</view>
					<view class="grace-comment-date">
						<text>{{value.createTime}}</text>
						<text>{{value.likeCount}}</text>
					</view>
					<view class="grace-comment-content">{{value.content}}</view>
				</view>
			</view>
		</view>
	</view>
	<!-- 评论区 end -->
		<view style="text-align: center;" v-if="emptyShow">暂无评论</view>
		<view class="uni-loadmore" style="text-align: center;" v-if="showLoadMore">{{loadMoreText}}</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				serverUrl: this.serverUrl,
				staticUrl: this.staticUrl,
				id: ",",
				commentList: [],
				emptyShow:false,
				loadMoreText:"加载中...",
				showLoadMore:false,
				pageNumber: 1,
				pageSize: 7,
				count: 0,
			};
		},
		onLoad(e) {
			//console.log(e);
			this.id = e.id;
			this.getMyResourceComment(e.id);
		},
		onUnload() {
			this.commentList = [];
			this.loadMoreText = "加载更多";
			this.showLoadMore = false;
		},			
		onReachBottom() {
			console.log("onReachBottom");
			this.pageNumber += 1;
			if (this.count<this.pageSize) {
				this.loadMoreText = "没有更多数据了!"
				return;
			}
			this.showLoadMore = true;
			this.getMyResourceComment(this.id);
		},			
		onPullDownRefresh() {
			console.log("onPullDownRefresh");
			this.loadMoreText = "加载更多";
			this.pageNumber = 1; 
			this.commentList = [];
			this.getMyResourceComment(this.id);
		},			
		methods: {
			getMyResourceComment(id) {
				var data = {
					resourceId: id,
					pageNumber: this.pageNumber,
					pageSize: this.pageSize,
				};
				uni.request({
					url: this.serverUrl + 'user-api/getMyResourceComment',
					header: {
						"content-type": "application/x-www-form-urlencoded; charset=UTF-8"
					},
					data: data,
					method: "POST",
					success: (r) => {
						//console.log(r.data.data);
						if (r.data.code == '000000') {
							for (var i = 0; i < r.data.data.length; i++) {
								var tmpObj = {
									id: r.data.data[i].id,
									resourceId: r.data.data[i].resourceId,
									content: r.data.data[i].content,
									createTime: r.data.data[i].createTime,
									createUser: r.data.data[i].createUser,
									likeCount: r.data.data[i].likeCount
								};
								this.commentList.push(tmpObj);
							}
							this.count = r.data.data.length;
							if(this.commentList.length<1){
								this.emptyShow = true;
							}
						} else {
							uni.showToast({
								title: r.data.message
							});
						}
						uni.stopPullDownRefresh();
					},
					fail: (data, code) => {
						console.log('fail' + JSON.stringify(data));
						uni.stopPullDownRefresh();
					}
				})
			},
		}
	}
</script>

<style>

</style>
